import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import Foo from '../components/Foo.vue'
import FooChild from '../components/FooChild.vue'
import FooChild2 from '../components/FooChild2.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',name: 'Home',component: Home,
  },
  {
    path: '/about',name: 'About',component: () => import('../views/About.vue'),
  },
  {
    path: '/foo',name: 'foo',component: Foo,
  },
  {
    path: '/foo/:id',name: 'foo2',component: Foo,
    children: [
      {
        path: 'profile',name: 'foo2-1',component: FooChild,
      },
    ],
  },
  {
    path: '/a',redirect: '/foo',
  },
  {
    path: '*',name: '404',component: Foo,
  },
  {
    path: '/bar',
    components: {
      default: Foo,a: FooChild,b: FooChild2,
    },
  },
]

const router = new VueRouter({
  mode: 'history',
  routes,
})

router.beforeEach((to, from, next) => {
  // ...
  next()
})
export default router
